<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>拦截器</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
    
</head>
<body>
    <!-- api.xiaohigh.com/lol -->
    <button> LOL </button>
    <script>
        //添加 axios 的请求拦截器
        axios.interceptors.request.use((config) => {
            //请求拦截器成功的回调
            console.log('请求拦截器-成功');
            //修改 config
            config.params = {
                class: 'h5211027'
            }
            //必填项
            return config;
        },  error => {
            //请求拦截器失败的回调
            console.log('请求拦截器-失败')
            return Promise.reject(error);
        });

        //添加 axios 的响应拦截器
        axios.interceptors.response.use(response => {
            console.log('响应拦截器-成功'); // AJAX 请求成功以后, 自动执行
            //返回结果
            return response.data;
        }, error => {
            console.log('响应拦截器-失败'); // AJAX 请求失败以后, 自动执行
            //返回失败的 promise 对象
            return Promise.reject(error);
        });

        //获取button
        let btn = document.querySelector('button');

        //绑定单机事件
        btn.onclick = function(){
            //
            axios.get('https://api.xiaohigh.com/lol')
            .then(res => {
                console.log(res);
            }, error=>{
                console.log(error);
            })
        }
        // class=h5211027
    </script>
</body>
</html>